import puppeteer from 'puppeteer';
import { segment } from 'oicq';
import fs from 'fs';
import path from 'path';
import { createLogger } from '../../modules/Logger.js';

// 创建日志实例
const logger = createLogger('pippi-渲染');

// 获取当前文件所在目录
const __dirname = path.dirname(new URL(import.meta.url).pathname);

// 读取 HTML 文件内容
const htmlPath = path.join(__dirname, 'xr.html');

/**
 * 替换 HTML 模板中的占位符
 * @param {string} htmlTemplate - HTML 模板字符串
 * @param {object} data - 包含占位符替换值的对象
 * @returns {string} - 替换后的 HTML 字符串
 */
function replacePlaceholders(htmlTemplate, data) {
    let html = htmlTemplate;
    for (const [key, value] of Object.entries(data)) {
        const placeholder = `{{${key}}}`;
        html = html.replace(new RegExp(placeholder, 'g'), value);
    }
    return html;
}

/**
 * 公共渲染函数
 * @param {object} e - 消息事件对象
 * @param {string} imageUrl - 背景图片的 URL
 * @param {string} msgContent - 消息内容
 * @param {string} title - 标题
 * @param {string} subtitle - 副标题
 * @param {boolean} isVertical - 是否为竖屏
 */
async function renderAndSendMsgCommon(e, imageUrl, msgContent, title, subtitle, isVertical) {
    logger.info(`开始渲染${isVertical ? '竖屏' : '横屏'}消息内容`);

    let browser;
    try {
        // 读取 HTML 模板文件
        const htmlTemplate = fs.readFileSync(htmlPath, 'utf-8');

        // 根据横竖屏设置不同的字体大小
        const fontSizeMultiplier = isVertical ? 2 : 1;
        const titleFontSize = 32 * fontSizeMultiplier;
        const subtitleFontSize = 24 * fontSizeMultiplier;
        const messageContentFontSize = 20 * fontSizeMultiplier;

        // 准备占位符替换数据
        const data = {
            imageUrl,
            titleFontSize,
            subtitleFontSize,
            messageContentFontSize,
            title,
            msgContent
        };

        // 替换 HTML 模板中的占位符
        let html = replacePlaceholders(htmlTemplate, data);

        if (subtitle) {
            html = html.replace('{{subtitle}}', `<div class="subtitle">${subtitle}</div>`);
        } else {
            html = html.replace('{{subtitle}}', '');
        }

        // 启动 Puppeteer 浏览器
        browser = await puppeteer.launch({
            headless: true,
            args: [
                '--disable-gpu',
                '--disable-dev-shm-usage',
                '--disable-setuid-sandbox',
                '--no-first-run',
                '--no-sandbox',
                '--no-zygote',
                '--single-process',
            ],
        });
        const page = await browser.newPage();

        // 设置页面内容
        await page.setContent(html);

        // 根据横竖屏设置不同的视口
        const viewport = isVertical ? { width: 1080, height: 1920 } : { width: 1280, height: 720 };
        await page.setViewport(viewport);

        // 截取页面截图并转换为 Base64 编码
        const screenshotBase64 = await page.screenshot({ encoding: 'base64', type: 'png' });

        // 发送图片消息
        await e.reply(segment.image(`base64://${screenshotBase64}`));

        logger.info(`${isVertical ? '竖屏' : '横屏'}消息内容渲染完成`);
    } catch (error) {
        logger.error(`渲染${isVertical ? '竖屏' : '横屏'}消息内容时发生错误: ${error.message}`);
        await e.reply(msgContent);
    } finally {
        if (browser) {
            await browser.close();
        }
    }
}

/**
 * 自动选择横竖屏的渲染函数
 * @param {object} e - 消息事件对象
 * @param {string} imageUrl - 背景图片的 URL
 * @param {string} msgContent - 消息内容
 * @param {string} title - 标题，默认为 '统计信息'
 * @param {string} subtitle - 副标题
 */
export async function renderAndSendMsgAuto(e, imageUrl, msgContent, title = '统计信息', subtitle) {
    // 根据消息内容的长度来决定是否使用竖屏
    const isVertical = msgContent.length > 200; // 可以根据实际情况调整这个阈值
    await renderAndSendMsgCommon(e, imageUrl, msgContent, title, subtitle, isVertical);
}